<template>
  <div style="margin-top: 10px; margin-bottom: 20px">
    <el-date-picker
        v-model="tvalue"
        type="date"
        placeholder="选择日期"
        format="YYYY 年 MM 月 DD 日"
        value-format="YYYY-MM-DD"
        style="margin-right: 5px">
    </el-date-picker>
    <el-select placeholder="请选择任务状态" clearable="true" style="margin-right: 5px" v-model="status">
      <el-option key="可分配" label="可分配" value="可分配"/>
      <el-option key="可调度" label="可调度" value="可调度"/>
      <el-option key="已分配" label="已分配" value="已分配"/>
      <el-option key="已领货" label="已领货" value="已领货"/>
      <el-option key="完成" label="完成" value="完成"/>
      <el-option key="失败" label="失败" value="失败"/>
    </el-select>
    <el-select placeholder="请选择任务类型" clearable="true" style="margin-right: 5px" v-model="type">
      <el-option
          v-for="item in typecase"
          :key="item"
          :label="item"
          :value="item">
      </el-option>
    </el-select>
    <el-button type="primary" style="margin-left: 10px" @click = "search1">查询</el-button>
  </div>
</template>

<script>
import router from "@/router"
  export default {
    name: "Header",
    data() {
      return {
        status:'',
        type:'',
        typecase:['送货收款','收款','送货','退货','换货'],
        tvalue:''
      }
    },
    methods:{
      logout() {

      },
      search1:function () {
        this.$emit('find',this.status,this.tvalue,this.type)

      }

    }
  }
</script>

<style scoped>
.layout-container-demo .el-header {
  position: relative;
  background-color: var(--el-color-primary-light-7);
  color: var(--el-text-color-primary);
}
.layout-container-demo .el-aside {
  color: var(--el-text-color-primary);
  background: var(--el-color-primary-light-8);
}
.layout-container-demo .el-menu {
  border-right: none;
}
.layout-container-demo .el-main {
  padding: 0;
}
.layout-container-demo .toolbar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  right: 20px;
}
</style>